﻿@inject IDataCacheService _datacacheService



<MDCard Href="@("/entries/index/" + Model.Id)" Class="on-surface-text h-100">
    @if (Type == SteamDisplayType.LargeCard)
    {
            <div class="h-100" style="display: flex; flex-direction: column;">
                <img class="w-100" src="@Model.MainImage" alt="@Model.Name">
                <div class="pa-3 pb-2 h-100" style=" display: flex; flex-direction: column; justify-content: space-between;">
                    <div style="display: flex; width: 100%;">
                        <div style="width: 100%; display: flex; flex-direction: column; justify-content: space-between;">
                            <header class="mb-2" style=" display: flex; align-items: center;">
                                @if (Purchased)
                                {
                                    <div class="type-inline-chip">已入库</div>
                                }
                                <div class="title-large">@Model.Name</div>
                            </header>
                            <span class="text-truncate-3 label-large">
                                @Model.BriefIntroduction
                            </span>

                        </div>
                    </div>
                    <div class="mt-2" style="display: flex; justify-content: space-between;">
                        <div style="display: flex; flex-direction: column;">
                            @if (Model.EvaluationCount > 0)
                            {
                                <div>
                                    <CnGalWebSite.Shared.Component.Entries.NewVersion.BasicInforAloneTip Icon="@IconType.ThumbsUp" Text="@($"{Model.RecommendationRate:0}% 好评（{Model.EvaluationCount}条评测）")" />
                                </div>
                            }
                            @if (Model.PublishTime != null)
                            {
                                <div>
                                    <CnGalWebSite.Shared.Component.Entries.NewVersion.BasicInforAloneTip Icon="@IconType.DeterminedTime" Text="@(Model.PublishTime?.ToString("yyyy年M月d日"))" />
                                </div>
                            }

                            @if (Model.CutLowest > 0)
                            {
                                <div>
                                    <CnGalWebSite.Shared.Component.Entries.NewVersion.BasicInforAloneTip Icon="@IconType.Chart" Text="@(Model.PriceLowest.Value.ToString("¥ 0.00")+( Model.CutLowest==0?"": " - "+Model.CutLowest+"% OFF"))" />
                                </div>
                            }

                            @if (Model.PlayTime > 0)
                            {
                                <div>
                                    <CnGalWebSite.Shared.Component.Entries.NewVersion.BasicInforAloneTip Icon="@IconType.Played" Text="@($"平均游玩时长：{Model.PlayTime/60.0:0.0} 小时")" />
                                </div>
                            }
                        </div>
                        <div class="primary-text  label-large" style=" display: flex; flex-direction: column; align-items: center; width: 100px; justify-content: center;">
                            <span class="title-large">
                                @(Model.PriceNow.Value.ToString("¥ 0.00"))
                            </span>

                            @if (Model.CutNow > 0)
                            {
                                <span>
                                    @(Model.CutNow+"% OFF")
                                </span>
                                <span class="h6" style="text-decoration: line-through; ">
                                    @("¥ "+Model.OriginalPrice.Value.ToString("0.00"))
                                </span>
                            }
                        </div>
                    </div>
                </div>
            </div>
    }
    else
    {
        @if (_datacacheService.IsApp)
        {
            <MDCard Outline Style="flex-direction: row;">
                <div style="display: flex; width: 100%;">
                    <img style=" height: 67px; " src="@Model.MainImage">
                    <div class="ps-2" style="width: 100%; display: flex; flex-direction: column; justify-content: space-between;">
                        <header style=" display: flex; align-items: center;">
                            @if (Purchased)
                            {
                                <CnGalWebSite.Shared.MasaComponent.Shared.Components.MasaIcon Type="IconType.Check" XSmall/>
                            }
                            <span class="text-truncate-1 title-medium">@Model.Name</span>
                        </header>

                        <div style="display: flex; flex-direction: column;">
                            @if (Model.EvaluationCount > 0)
                            {
                                <div>
                                    <CnGalWebSite.Shared.Component.Entries.NewVersion.BasicInforAloneTip Icon="@IconType.ThumbsUp" Text="@($"{Model.RecommendationRate:0}% ({Model.EvaluationCount})")" />
                                </div>
                            }
                            @if (Model.CutLowest > 0)
                            {
                                <div>
                                    <CnGalWebSite.Shared.Component.Entries.NewVersion.BasicInforAloneTip Icon="@IconType.Chart" Text="@(Model.PriceLowest.Value.ToString("¥ 0.00")+( Model.CutLowest==0?"": " (-"+Model.CutLowest+"%)"))" />
                                </div>
                            }
                        </div>
                    </div>
                </div>
                <div class="primary-text  label-large" style=" display: flex; flex-direction: column; align-items: center; width: 100px; justify-content: center; ">
                    <span class="title-medium">
                        @(Model.PriceNow.Value.ToString("¥ 0.00"))
                    </span>

                    @if (Model.CutNow > 0)
                    {
                        <span style="font-size:small ">
                            @(Model.CutNow+"% OFF")
                        </span>
                        <span style=" text-decoration: line-through; ">
                            @("¥ "+Model.OriginalPrice.Value.ToString("0.00"))
                        </span>
                    }

                </div>
            </MDCard>
        }
        else
        {
                <div style="display:flex;">
                    <div style="display: flex; width: 100%;">
                        <img style="height: 140px;" src="@Model.MainImage">
                        <div class="ps-3 pt-2 pb-2" style="width: 100%; display: flex; flex-direction: column; justify-content: space-between;">
                            <header style=" display: flex; align-items: center;">
                                @if (Purchased)
                                {
                                    <div class="type-inline-chip">已入库</div>
                                }
                                <div class="title-large">@Model.Name</div>
                            </header>
                            <span class="text-truncate-2 label-large">
                                @Model.BriefIntroduction
                            </span>
                            <div class="row">
                                @if (Model.EvaluationCount > 0)
                                {
                                    <div class="col-6 col-xxl-4">
                                        <CnGalWebSite.Shared.Component.Entries.NewVersion.BasicInforAloneTip Icon="@IconType.ThumbsUp" Text="@($"{Model.RecommendationRate:0}% 好评（{Model.EvaluationCount}条评测）")" />
                                    </div>
                                }
                                @if (Model.PublishTime != null)
                                {
                                    <div class="col-6 col-xxl-4">
                                        <CnGalWebSite.Shared.Component.Entries.NewVersion.BasicInforAloneTip Icon="@IconType.DeterminedTime" Text="@(Model.PublishTime?.ToString("yyyy年M月d日"))" />
                                    </div>
                                }
                                @if (Model.CutLowest > 0)
                                {
                                    <div class="col-6 col-xxl-4">
                                        <CnGalWebSite.Shared.Component.Entries.NewVersion.BasicInforAloneTip Icon="@IconType.Chart" Text="@(Model.PriceLowest.Value.ToString("¥ 0.00")+( Model.CutLowest==0?"": " - "+Model.CutLowest+"% OFF"))" />
                                    </div>
                                }
                                @if (Model.PlayTime > 0)
                                {
                                    <div class="col-6 col-xxl-4">
                                        <CnGalWebSite.Shared.Component.Entries.NewVersion.BasicInforAloneTip Icon="@IconType.Played" Text="@($"平均游玩时长：{Model.PlayTime/60.0:0.0} 小时")" />
                                    </div>
                                }
                            </div>
                        </div>
                    </div>
                    <div class="primary-text label-large" style=" display: flex; flex-direction: column; align-items: center; width: 180px; justify-content: center;">
                        <span style="display: flex; align-items: center;">
                            <span class="title-large">
                                @(Model.PriceNow.Value.ToString("¥ 0.00"))
                            </span>
                            @if (Model.CutNow > 0)
                            {
                                <span class="ms-1">
                                    @(Model.CutNow + "% OFF")
                                </span>
                            }
                        </span>
                        @if (Model.CutNow > 0)
                        {
                            <span style="text-decoration: line-through; ">
                                @("¥ "+Model.OriginalPrice.Value.ToString("0.00"))
                            </span>
                        }
                    </div>
                </div>

        }


    }

</MDCard>

@code {
    [Parameter]
    public StoreInfoCardModel Model { get; set; }
    [Parameter]
    public SteamDisplayType Type { get; set; }
    [Parameter]
    public bool Purchased { get; set; }
}
